<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript" 	src="./js/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="./js/common.js"></script>
		<script type="text/javascript" src="./js/cim/message.js"></script>
		<script type="text/javascript" src="./js/cim/replybody.js"></script>
		<script type="text/javascript" src="./js/cim/sentbody.js"></script>
		<script type="text/javascript" src="./js/cim/cim.web.sdk.js"></script>
	</head>

	<body>
		
		<script type="text/javascript">
			$(document).ready(function(){
				initNotification();
			});
			
			// 判断是否支持桌面通知
			function initNotification(){
				//判断浏览器是否支持桌面通知
				if (window.Notification) {
					var notification = window.Notification;
					if (notification.permission == "default") {
						 notification.requestPermission(function(permission) {
						});
					}
				}
			}
			
			function aaa() {
				alert(1)
			}
			
			// 当socket连接成功回调
			function onConnectFinished(){
				CIMPushManager.bind($('#account').val());
			}
			
			
			// 当收到请求回复时候回调(请求恢复消息,是socket链接成功后会,发一条信息给后端,后端在返回一条消息)
			function onReplyReceived(reply) {
				console.log(reply);
				if(reply.key==='client_bind' && reply.code === "200" ) {
					hideProcess();
					$("#log-success").show();
					$("#log-success>span").text("账号:" + $('#account').val());
					$("#log-div").hide();
					$("#send-div").show();
				}
			}
				  
			// 当收到消息时候回调
			function onMessageReceived(message) { 
				console.log(message);
				//账户在其他地方登录了
				if(message.action === ACTION_999){
					alert("你的账号在其他地方登录了!")
					$('#account').val('');
					$("#log-div").show();
					$("#log-success").hide();
					$("#send-div").hide();
					return ;
				}
				var time = new Date(message.timestamp).toLocaleString();
				$("#content").append("<p>"+time+"</p><p>"+message.content+"</p>"); 
			}
			
			// 登录方法
			function doLogin(){	
				if($.trim($('#account').val()) =='' ){
				   return;
				}
				showProcess('正在接入请稍后......');
				/**登录成功后创建连接****/
				CIMPushManager.connect();
			}
			
			// 发送消息
			function send() {
				var account = $('#send-account').val();
				var message = $('#send-content').val();
				if($.trim(message)===''){
				   return;
				}
				$.post("http://localhost:5200/gege/api/message/send", 
					{content:message,action:2,sender:'system',receiver:account,format:'0'}, 
					function(data){
						var time = new Date(message.timestamp).toLocaleString();
						$("#content").append("<p style='text-align: right;'>"+time+"</p><p style='text-align: right;'>"+message+"</p>");
					}
				);
			}
		</script>
		
		
		
		<div id="log-success"><span style="size: 18px;color: red;"></span></div>
		<button onclick="aaa()">aaa</button>
		
		<div id="log-div" style="margin-bottom: 50px;">
			账号:<input  type="text" id="account" placeholder="帐号（数字或者英文字母）"/>
			<button onclick="doLogin()">登录</button>
		</div>
		
		<div id="send-div" style="margin-bottom: 50px;display: none;">
			发送给:<input  type="text" id="send-account" placeholder="帐号（数字或者英文字母）"/><br/>
			内容: <input type="text" id="send-content" placeholder="帐号（数字或者英文字母）"/><
			<button onclick="send()">发送</button>
		</div>
		
		<div id="content" style="height:500px;width:600px;overflow:auto;background:#EEEEEE;">
		</div>
		
	</body>

</html>
